{extend name="../../admin/view/main"}

{block name='content'}
<form action="{:request()->url()}" autocomplete="off" class="layui-form layui-card" data-auto="true" method="post">
    <div class="layui-card-body padding-40">

        <label class="layui-form-item relative block">
            <span class="color-green font-w7">服务名称</span>
            <span class="color-desc margin-left-5">name</span>
            <input class="layui-input" name="name" placeholder="{$data.name|default='服务名称'}" value="{$data.name|default=''}"/>
            <span class="help-block">请填写服务名称，建议字符不要太长，一般4个汉字</span>
        </label>

        <div class="layui-form-item relative block">
            <span class="color-green font-w7">图标</span>
            <span class="color-desc margin-left-5">Icon</span>
            <br>
            <input type="hidden" name="icon" value="{$data.icon|default=''}">
            <script>$('[name=icon]').uploadOneImage()</script>
            <br>
        </div>
        <div class="layui-form-item relative block">
            <span class="color-green font-w7">图片</span>
            <span class="color-desc margin-left-5">Image</span>
            <br>
            <input type="hidden" name="image" value="{$data.image|default=''}">
            <script>$('[name=image]').uploadOneImage()</script>
            <br>
        </div>
        <label class="layui-form-item relative block">
            <span class="color-green font-w7">纬度</span>
            <div id="locationBtn" class="layui-icon layui-icon-location map-location">点击选择位置</div>
            <input class="layui-input" name="lat" id="latitude" placeholder="请输入纬度" required value='{$data.lat|default=""}'>

        </label>
        <label class="layui-form-item relative block">
            <span class="color-green font-w7">经度</span>
            <input class="layui-input" name="lng" id="longitude" placeholder="请输入经度" required value='{$data.lng|default=""}'>
        </label>
        <label class="layui-form-item relative block">
            <span class="color-green font-w7">联系电话</span>
            <span class="color-desc margin-left-5">phone</span>
            <input class="layui-input" name="phone" placeholder="请输入联系电话" required value='{$data.phone|default=""}'>
        </label>
        <label class="layui-form-item relative block">
            <span class="color-green font-w7">详细地址</span>
            <span class="color-desc margin-left-5">Address</span>
            <input class="layui-input" name="address" placeholder="请输入详细地址" required value='{$data.address|default=""}'>
        </label>
        <label class="layui-form-item relative block">
            <span class="color-green font-w7">营业时间</span>
            <span class="color-desc margin-left-5">business</span>
            <input class="layui-input" name="business" placeholder="请输入营业时间" required value='{$data.business|default=""}'>
        </label>
        <div class="layui-form-item relative block">
            <span class="color-green font-w7 label-required-prev">内容</span>
            <span class="color-desc margin-left-5">Page Content</span>
            <label class="relative block">
                <textarea class="layui-hide" name="content">{$data.content|default=''}</textarea>
            </label>
        </div>

        <div class="hr-line-dashed"></div>

        <div class="layui-form-item text-center">
            <button class="layui-btn" type="submit">保存数据</button>
            <button class="layui-btn layui-btn-danger" data-confirm="确定要取消编辑吗？" data-history-back type='button'>取消编辑</button>
        </div>
    </div>

</form>

<script>
    layui.form.render();
    require(['ckeditor'], function () {
        window.createEditor('[name=content]', {height: 500});
    });
    layui.config({
        base : '/static/plugs/'
    }).extend({
        locationX: 'location/locationX',
        location: 'location/location',
    }).use(['layer','form','jquery','location'],function(){
        $ = layui.jquery;
        var form = layui.form;
        var location = layui.location;

        // 自己维护初始化标注。这里给的是天安门
        //
        var locationData = {lng:103.78137,lat:36.074913};


        location.render("#locationBtn",{
            type:0,
            apiType: "gaodeMap",
            coordinate: "gaodeMap",
            mapType: 2,
            zoom: 15,
            title: '区域定位',
            init: function(){
                return {longitude: $("#longitude").val()?$("#longitude").val():locationData.lng,latitude: $("#latitude").val()?$("#latitude").val():locationData.lat};
            },
            success: function (data) {
                console.log(data);
                $("#longitude").val(data.lng);
                $("#latitude").val(data.lat);
            }
        });

    });
</script>
{/block}